<template>
  <el-card>
    <el-row class="margin-bottom-sm">
      <el-col :span="4" :class="{ 'text-red': !info.companyName }"
        >公司名:</el-col
      >
      <el-col :span="20">{{ info.companyName || "" }}</el-col>
    </el-row>
    <el-row class="margin-bottom-sm">
      <el-col :span="4" :class="{ 'text-red': !info.countryCode }"
        >国家:</el-col
      >
      <el-col :span="8">{{ info.countryCode || "" }}</el-col>
      <el-col :span="4" :class="{ 'text-red': !info.stateOrRegionName }"
        >省:</el-col
      >
      <el-col :span="8"
        >{{ info.stateOrRegionName || "" }}
        {{ info.stateOrRegion ? `(${info.stateOrRegion})` : "" }}</el-col
      >
    </el-row>
    <el-row class="margin-bottom-sm">
      <el-col :span="4" :class="{ 'text-red': !info.cityName }">城市:</el-col>
      <el-col :span="8">{{ info.cityName || "" }}</el-col>
      <el-col :span="4" :class="{ 'text-red': !info.postalCode }">邮编:</el-col>
      <el-col :span="8">{{ info.postalCode || "" }}</el-col>
    </el-row>
    <el-row class="margin-bottom-sm">
      <el-col :span="4" :class="{ 'text-red': !info.addressLine1 }"
        >地址1:</el-col
      >
      <el-col :span="20">{{ info.addressLine1 || "" }}</el-col>
    </el-row>
    <el-row class="margin-bottom-sm">
      <el-col :span="4">地址2:</el-col>
      <el-col :span="20">{{ info.addressLine2 || "" }}</el-col>
    </el-row>
    <el-row class="margin-bottom-sm">
      <el-col :span="4">ID No:</el-col>
      <el-col :span="20" v-if="info.eiNo">{{ info.eiNo }} (EI)</el-col>
      <el-col :span="20" v-if="info.aniNo">{{ info.aniNo }} (ANI)</el-col>
      <el-col :span="20" v-if="info.syNo">{{ info.syNo }} (SY)</el-col>
    </el-row>
  </el-card>
</template>

<script>
export default {
  props: {
    info: {
      type: Object,
      default: function() {
        return {};
      }
    }
  }
};
</script>

<style></style>
